@charset "utf-8";

@import "reset";
@import "fonts";


@function r($px){
    @return (1rem/640px)*$px;
}



body{
    height: 100%;
    width: 100%;
}

//顶条
.nav_title{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    height: r(90px);
    width: 100%;
    padding-left: 3%;
    padding-right: 3%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #c1c1c1;
    background-color: #f7f7f7;
    a{
        font-size: r(30px);
        color: #999;
    }
    h1{
        font-size: r(35px);
        color: #333;
        font-weight: 500;
    }
}

//弹窗
.pop-up{
    display: none;
    height: r(183px);
    width: r(249px);
    background-color: rgba(0,0,0,.8);
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    border-radius: r(15px);
    text-align: center;
    padding-top: r(30px);
    i{
        display: block;
        font-size: r(71px);
        color: #d6d6d6;
    }
    p{
        font-size: r(28px);
        color: #fff;
        font-weight: 600;
        margin-top: r(15px);
    }
}

//输入框样式
.i_content{
    font-size: r(28px);
    display: flex;
    align-items: center;
    justify-content: center;
    p{
        width: 26.12%;
        padding-left: r(18px);
    }
    input{
        border: 0px;
        font-size: r(28px);
        width: 73%;
        &::-webkit-input-placeholder{
            color: #ccc;
            font-size: r(28px);
        }
    }
}

@media (min-width:320px){
    html{
        font-size: 320px;
    }
}

@media (min-width:360px){
    html{
        font-size: 360px;
    }
}
@media (min-width:375px){
    html{
        font-size: 375px;
    }
}
@media (min-width:414px){
    html{
        font-size: 414px;
    }
}
@media (min-width:640px){
    html{
        font-size: 640px;
    }
}